{% extends "base.html" %}
{% load static %}
{% load form_utils %}

{% block title %}{{ title }} - ExamPulse{% endblock %}

{% block extra_css %}
<link rel="stylesheet" href="{% static 'users/css/past-score-form.css' %}">
{% endblock %}

{% block content %}
<div class="score-form-container">
    <div class="row justify-content-center w-100">
        <div class="col-12">
            <div class="card score-form-card">
                <div class="card-header-custom">
                    <div class="d-flex justify-content-between align-items-center flex-wrap">
                        <div>
                            <h4 class="mb-2">
                                <i class="fas fa-history me-2"></i>{{ title }}
                            </h4>
                            <div class="student-info-badge">
                                <i class="fas fa-user-graduate me-1"></i>
                                学生：{{ student.name }}
                                {% if past_score %}
                                <span class="ms-2">
                                    <i class="fas fa-calendar me-1"></i>{{ past_score.exam_year }}年
                                </span>
                                {% endif %}
                            </div>
                        </div>
                        <div class="text-end">
                            <div class="text-white-50">
                                {% if past_score %}编辑{% else %}添加{% endif %}历史成绩记录
                            </div>
                        </div>
                    </div>
                </div>

                <div class="card-body p-4 p-md-5">
                    <!-- 【核心修复】表单 action 属性 -->
                    <form id="pastScoreForm" method="post" novalidate
                          {% if past_score %}
                              action="{% url 'users:past_score_update' student.id past_score.id %}"
                          {% else %}
                              action="{% url 'users:past_score_add' student.id %}"
                          {% endif %}>

                        {% csrf_token %}

                        <!-- 基本信息部分 -->
                        <div class="form-section">
                            <h5 class="section-title">
                                <i class="fas fa-info-circle"></i>基本信息
                            </h5>

                            <div class="row">
                                <div class="col-md-6 mb-4">
                                    <label for="{{ form.exam_year.id_for_label }}" class="form-label-custom">
                                        <i class="fas fa-calendar text-primary"></i>{{ form.exam_year.label }}
                                    </label>
                                    {{ form.exam_year }}
                                    {% if form.exam_year.errors %}
                                        <div class="invalid-feedback d-block">
                                            {% for error in form.exam_year.errors %}
                                                {{ error }}
                                            {% endfor %}
                                        </div>
                                    {% endif %}
                                </div>

                                <div class="col-md-6 mb-4">
                                    <label for="{{ form.total_score.id_for_label }}" class="form-label-custom">
                                        <i class="fas fa-star text-primary"></i>{{ form.total_score.label }}
                                    </label>
                                    <div class="score-input-group">
                                        {{ form.total_score }}
                                        <span class="score-suffix">分</span>
                                    </div>
                                    {% if form.total_score.errors %}
                                        <div class="invalid-feedback d-block">
                                            {% for error in form.total_score.errors %}
                                                {{ error }}
                                            {% endfor %}
                                        </div>
                                    {% endif %}
                                </div>
                            </div>
                        </div>

                        <!-- 科目成绩部分 -->
                        <div class="form-section">
                            <h5 class="section-title">
                                <i class="fas fa-book-open"></i>科目成绩
                            </h5>

                            <div class="total-score-display">
                                <div class="score-preview">当前总分预览</div>
                                <div class="total-score-value" id="totalScorePreview">
                                    {% if past_score and past_score.total_score %}{{ past_score.total_score }}{% else %}0{% endif %}
                                </div>
                                <div class="score-preview">分</div>
                            </div>

                            <div class="row">
                                {% for subject in form.get_visible_subjects %}
                                <div class="col-md-6 subject-row">
                                    <div class="card subject-card h-100">
                                        <div class="card-body">
                                            <div class="d-flex align-items-center mb-3">
                                                <div class="subject-icon {{ subject.color_class }}">
                                                    <i class="fas fa-{{ subject.icon }}"></i>
                                                </div>
                                                <div>
                                                    <h6 class="mb-0">{{ subject.name }}</h6>
                                                    <small class="text-muted">满分{{ subject.max_score }}分</small>
                                                </div>
                                            </div>
                                            <label for="id_{{ subject.field }}" class="form-label-custom small">{{ subject.name }}成绩</label>
                                            <div class="score-input-group">
                                                {{ form|get_field:subject.field }}
                                                <span class="score-suffix">分</span>
                                            </div>
                                            {% with form|get_field_errors:subject.field as errors %}
                                                {% if errors %}
                                                    <div class="invalid-feedback d-block">
                                                        {% for error in errors %}
                                                            {{ error }}
                                                        {% endfor %}
                                                    </div>
                                                {% endif %}
                                            {% endwith %}
                                        </div>
                                    </div>
                                </div>
                                {% empty %}
                                <div class="col-12">
                                    <div class="alert alert-warning">
                                        <i class="fas fa-exclamation-triangle me-2"></i>
                                        该学生未配置任何考试科目，请先在学生详情中设置考试科目。
                                    </div>
                                </div>
                                {% endfor %}
                            </div>
                        </div>

                        <!-- 备注部分 -->
                        <div class="form-section">
                            <h5 class="section-title">
                                <i class="fas fa-sticky-note"></i>{{ form.notes.label }}
                            </h5>
                            <div class="mb-4">
                                {{ form.notes }}
                                {% if form.notes.errors %}
                                    <div class="invalid-feedback d-block">
                                        {% for error in form.notes.errors %}
                                            {{ error }}
                                        {% endfor %}
                                    </div>
                                {% endif %}
                            </div>
                        </div>

                        <!-- 操作按钮 -->
                        <div class="d-grid gap-2 d-md-flex justify-content-md-end mt-4">
                            <a href="{% url 'users:student_detail' student.id %}" class="btn btn-back me-md-3">
                                <i class="fas fa-arrow-left me-2"></i>返回详情
                            </a>
                            <button type="submit" class="btn btn-save">
                                <i class="fas fa-save me-2"></i>{% if past_score %}更新成绩{% else %}保存成绩{% endif %}
                            </button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>
{% endblock %}

{% block extra_js %}
<script src="{% static 'users/js/past-score-form.js' %}"></script>
{% endblock %}